<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!-- 引入样式 -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <script src="../js/axios.min.js" type="text/javascript"></script>
    <script src="../js/vue.js" type="text/javascript"></script>
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
    <title>我的钱包</title>
</head>
<body>
<div id="app">
    <el-container>
        <el-row>
            <el-form :label-position="labelPosition" label-width="80px" :model="userInfo">
                <el-form-item label="余额">
                    <el-input v-model="userInfo.balance" :disabled="true"></el-input>
                </el-form-item>
            </el-form>
        </el-row>
        <el-row>
            <!--            <el-button type="primary" @click="recharge()">充值</el-button>-->
            <el-button @click="showGetCash" type="primary" size="small">提现</el-button>
        </el-row>
    </el-container>
    <el-dialog
            title="提现"
            :visible.sync="dialogVisible"
            width="30%">
        <span>请输入提现金额</span><br>
        <el-input v-model="money"></el-input>
        <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="getCash()">确 定</el-button>
  </span>
    </el-dialog>
</div>
<script>
    new Vue({
        el: "#app",
        data() {
            return {
                userInfo: [],
                money: "",
                dialogVisible: false,
            }
        },
        methods: {
            showGetCash() {
                this.dialogVisible = true;
            },
            getCash() {
                axios.post("/account/wallet?money="+this.money).then(resp => {
                    if(this.money-this.userInfo.balance>0){
                        alert("提现金额不能大于余额")
                    }else{
                        if (resp.data.code == 200 && resp.status == 200) {
                            this.dialogVisible = false;
                            this.query();
                        }
                    }

                })
            },
            query() {
                axios.get("/account/getMyInfo").then(resp => {
                    if (resp.data.code == 200 && resp.status == 200) {
                        this.userInfo = resp.data.data;
                    }

                })
            }
        },
        created() {
            this.query()
        }
    })
</script>

</body>
</html>